import React, { Component } from 'react'
import connect from './connect'

// 图片滑块
import { Carousel } from 'antd-mobile'

import {
  SwiperContainer
} from './style'

@connect
class index extends Component {
  state = {
    dots: true
  }
  componentDidMount() {
    // 发起网络请求
    this.props.getSwiperCmp()
  }
  render() {
    // 异步加载容错
    let swiper = this.props.swiper ? this.props.swiper.toJS() : []
    return (
      <SwiperContainer>
        <Carousel infinite dots={true}>
          {swiper.map(item => (
            <img key={item.id} src={item.img} />
          ))}
        </Carousel>
      </SwiperContainer>
    )
  }
}

export default index


